<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>表单修饰符</title>
	</head>
	<body>
		<!-- 
		 1. 生命周期函数的方法名称 必须固定
		 2. 生命周期函数是VUE对象特有的函数，要放到根目录下，而不是methods里
		 3. 当页面渲染成功后，一共执行了4个生命周期方法
			第一类：VUE对象的创建 beforeCreate() created()
			第二类：VUE对象的挂载 beforeMount() mounted()
		4. 用户修改阶段
			第三类：beforeUpdate() updated()
		5. 销毁阶段
			销毁函数，VUE对象默认不会调用，可以通过函数由用户调用
			beforeDestroy()
			destroyed()
			
		 -->
		 <div id="app">
			<h3 v-text="msg"></h3>
			<button @click="destroy">销毁</button>
		 </div>
		 <script src="../js/vue.js"></script>
		 <script>
			 const app = new Vue({
				 el: "#app",
				 data: {
					 msg: 'VUE生命周期'
				 },
				 methods: {
					 
				 },
				// 在实例初始化之后，数据观测
				beforeCreate() {
					console.log("beforeCreate")
				},
				// 在实例创建后被立即调用
				created() {
					console.log("created")
				},
				// 在挂载开始之前被调用
				beforeMount() {
					console.log("beforeMount")
				},
				// 实例被挂载后调用
				mounted() {
					console.log("mounted")
				}
			 });
		 </script>
	</body>
</html>
